<template>
    <div class="processTable">
        <el-table :data="tableData" style="width: 100%;" border class="content-table-item">
            <el-table-column prop="stepNumber" label="审批步骤" align="center" width="90"></el-table-column>
            <el-table-column prop="stepName" label="审批步骤名称" align="center" width=""></el-table-column>
            <el-table-column prop="" label="审批人" align="center" width="">
                <template slot-scope="{ row, $index }">
                    <el-tag v-for="e,i in row.approvalList" :key="i" size="mini" style="margin:5px;">{{ e.nickname }}</el-tag>
                </template>
            </el-table-column>
            <el-table-column prop="remark" label="备注" align="center" width=""></el-table-column>
            <el-table-column prop="" label="操作" align="center" width="130">
                <template slot-scope="{ row, $index }">
                    <el-button type="text" size="mini" @click="editEvent(row,$index)" :disabled="globalStatus == 0">编辑</el-button>
                    <el-button type="text" size="mini" @click="deleteEvent(row,$index)" :disabled="globalStatus == 0">删除</el-button>
                </template>
            </el-table-column>
        </el-table>
    </div>
</template>

<script>
import { cloneDeep } from "lodash";
export default {
    props:{
        approvalProcessList:{
            type:Array,
            require:false,
            default:() => []
        },
        globalStatus:{
            type:Number | String,
            require:false,
            default:0
        }
    },
    data(){
        return {
            tableData:[]
        }
    },
    watch:{
        approvalProcessList:{
            handler(newVal,oldVal){
                this.tableData = newVal;
                console.log("审批路线流程list===>",newVal);
            },
            immediate:true,
            deep:true
        }
    },
    methods:{
        editEvent(row,index){
            this.$emit('tableChange',row,'edit');
        },
        deleteEvent(row,index){
            this.$emit('tableChange',row,'delete');
        }
    }
}
</script>

<style lang='scss' scoped>
.processTable{
    width:100%;
}
/*
::v-deep .el-table__header th {
  padding: 0;
}
::v-deep .el-table__row {
  margin-bottom: 15px;
}
::v-deep .el-table .el-table__cell{
  padding: 0;
}
*/
</style>